<template>
  <el-form
    :model="courseInfo"
    ref="queryFormRef"
    label-position="left"
    label-width="98px"
  >
    <el-row v-show="courseInfo!.isOperate">
      <div v-if="rejectCheckList?.length > 0 || schoolCheckList?.length > 0">
        <el-form-item
          label="驳回历史记录"
          v-if="
            (courseInfo!.examineStatusCode < 30 &&
              courseInfo!.examineStatusCode >= 10) ||
            courseInfo!.examineStatusCode >= 50
          "
        >
          <el-scrollbar style="width: 100%; height: 20vh; overflow-x: auto">
            <div class="scrollbar-flex-content">
              <el-card
                class="box-card mr-5 scrollbar-demo-item"
                v-for="(item, index) in rejectCheckList"
                :key="index"
              >
                <div>
                  <div>{{ auditStage(item.examineStatusCode) }}</div>
                  <div>审核时间：{{ item.createTime }}</div>
                  <div>审核结果：{{ item.reason }}</div>
                </div>
              </el-card>
            </div>
          </el-scrollbar>
        </el-form-item>

        <el-form-item
          label="审核历史记录"
          v-if="courseInfo!.examineStatusCode === 30"
        >
          <el-scrollbar style="width: 100%; height: 20vh; overflow-x: auto">
            <div class="scrollbar-flex-content">
              <el-card
                class="box-card mr-5 scrollbar-demo-item"
                v-for="(item, index) in schoolCheckList"
                :key="index"
              >
                <div>
                  <div>{{ auditStage(item.examineStatusCode) }}</div>
                  <div>审核时间：{{ item.createTime }}</div>
                  <div>审核结果：{{ item.reason }}</div>
                </div>
              </el-card>
            </div>
          </el-scrollbar>
        </el-form-item>
      </div>

      <el-form-item label="驳回历史记录" v-else> 暂无记录 </el-form-item>
    </el-row>
    <el-row>
      <el-col :span="20">
        <el-form-item label="课程名称" prop="name">
          <el-input
            :disabled="isDisabled"
            v-model="courseInfo!.name"
            placeholder="请输入名称"
            clearable
          />
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="20">
        <el-form-item label="副标题" prop="subtitle">
          <el-input
            :disabled="isDisabled"
            v-model="courseInfo!.subtitle"
            placeholder="请输入名称"
            clearable
          />
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="7">
        <el-form-item label="课程类别" prop="type">
          <el-select
            :disabled="isDisabled"
            v-model="courseInfo!.type"
            clearable
            placeholder="Select"
            style="width: 200px"
          >
            <el-option
              v-for="item in selectArr.typeArr"
              :key="item.value"
              :label="item.label"
              :value="item.value"
            />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="8">
        <el-form-item
          label="孩子年龄"
          style="margin: 0 20px"
          prop="childAgeList"
        >
          <el-select
            v-model="courseInfo!.childAgeList"
            multiple
            collapse-tags
            collapse-tags-tooltip
            :max-collapse-tags="1"
            placeholder="Select"
            style="width: 240px"
          >
            <el-option
              v-for="item in selectArr.childAgeArr"
              :key="(item as any).id"
              :label="(item as any).value"
              :value="(item as any).id"
              :disabled="true"
            />
          </el-select>
        </el-form-item>
      </el-col>
      <el-col :span="7">
        <el-form-item label="家长年龄" prop="parentAgeList ">
          <el-select
            v-model="courseInfo!.parentAgeList"
            multiple
            collapse-tags
            collapse-tags-tooltip
            :max-collapse-tags="1"
            placeholder="Select"
            style="width: 240px"
          >
            <el-option
              v-for="item in selectArr.parentAgeArr"
              :key="(item as any).id"
              :label="(item as any).value"
              :value="(item as any).id"
              :disabled="true"
            />
          </el-select>
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="20">
        <el-form-item label="课程描述" prop="introduction">
          <el-input
            :disabled="isDisabled"
            v-model="courseInfo!.introduction"
            placeholder="请输入"
            clearable
            type="textarea"
            :autosize="{ minRows: 5, maxRows: 10 }"
          />
        </el-form-item>
      </el-col>
    </el-row>

    <el-row>
      <el-col :span="20">
        <el-form-item label="备注" prop="remark">
          <el-input
            :disabled="isDisabled"
            v-model="courseInfo!.remark"
            placeholder="请输入"
            clearable
            type="textarea"
            :autosize="{ minRows: 5, maxRows: 10 }"
          />
        </el-form-item>
      </el-col>
    </el-row>

    <!-- <el-row>
          <el-col :span="15">
            <el-form-item label="适用人群">
              <el-input
                v-model="courseInfo.name"
                placeholder="请输入"
                clearable
              />
            </el-form-item>
          </el-col>
        </el-row> -->

    <el-row>
      <el-col :span="20">
        <el-form-item label="章节数量" prop="totalSection">
          <el-input
            :disabled="isDisabled"
            v-model="courseInfo!.totalSection"
            placeholder="请输入章节数量"
            clearable
          />
        </el-form-item>
      </el-col>
    </el-row>

    <el-form-item label="场景分类" prop="sceneId">
      <el-select
        :disabled="isDisabled"
        v-model="courseInfo!.sceneId"
        clearable
        placeholder="场景分类"
        style="width: 250px"
      >
        <el-option
          v-for="item in selectArr.sceneArr"
          :key="(item as any).id"
          :label="(item as any).name"
          :value="(item as any).id"
        />
      </el-select>

      <el-select
        :disabled="isDisabled"
        v-model="categoryId"
        clearable
        placeholder="一级分类"
        style="width: 250px; margin-left: 20px"
      >
        <el-option
          v-for="item in selectArr.catgroyList"
          :key="(item as any).id"
          :label="(item as any).name"
          :value="(item as any).id"
        />
      </el-select>
    </el-form-item>

    <el-form-item label="">
      <el-scrollbar height="140px">
        <el-card shadow="never" style="width: 520px; height: 140px">
          <el-check-tag
            :checked="false"
            v-for="(item, index) in courseInfo!.labels"
            :key="index"
            style="margin-right: 10px"
            >{{ (item as any).name }}</el-check-tag
          >
        </el-card>
      </el-scrollbar>
    </el-form-item>

    <el-form-item label="课程封面" prop="totalSection">
      <div
        v-if="courseInfo?.cover1"
        style="
          width: 370px;
          height: 230px;
          border: 1px solid rgb(162, 162, 162);
        "
      >
        <img
          style="width: 100%; height: 100%"
          :src="courseInfo?.cover1"
          alt=""
        />
        <span>封面1</span>
        <el-button
          style="padding-top: 0"
          link
          type="primary"
          @click="handlePreview(courseInfo?.cover1)"
          >查看图片</el-button
        >
      </div>
      <div v-else>
        <el-empty :image-size="150" description="未上传图片" />
        <span>封面1</span>
      </div>

      <div
        v-if="courseInfo?.cover2"
        style="
          width: 156px;
          height: 230px;
          border: 1px solid rgb(162, 162, 162);
          margin: 0 40px;
        "
      >
        <img
          style="width: 100%; height: 100%"
          :src="courseInfo?.cover2"
          alt=""
        />
        <span>封面2</span>
        <el-button
          style="padding-top: 0"
          link
          type="primary"
          @click="handlePreview(courseInfo?.cover2)"
          >查看图片</el-button
        >
      </div>

      <div v-else class="m-20">
        <el-empty :image-size="150" description="未上传图片" />
        <span>封面2</span>
      </div>

      <div
        v-if="courseInfo?.cover3"
        style="
          width: 230px;
          height: 230px;
          border: 1px solid rgb(162, 162, 162);
        "
      >
        <img
          style="width: 100%; height: 100%"
          :src="courseInfo?.cover3"
          alt=""
        />
        <span>封面3</span>
        <el-button
          style="padding-top: 0"
          link
          type="primary"
          @click="handlePreview(courseInfo?.cover3)"
          >查看图片</el-button
        >
      </div>

      <div v-else>
        <el-empty :image-size="150" description="未上传图片" />
        <span>封面3</span>
      </div>
    </el-form-item>

    <el-form-item label="课程介绍" prop="totalSection" style="margin-top: 30px">
      <div
        v-if="structure_img"
        style="
          margin: 40px;
          width: 200px;
          height: 200px;
          border: 1px solid rgb(162, 162, 162);
        "
      >
        <img
          style="width: 100%; height: 100%; object-fit: scale-down"
          :src="structure_img"
          alt=""
        />
        <span>课程/书籍结构</span>
        <el-button link type="primary" @click="handlePreview(structure_img)"
          >查看图片</el-button
        >
      </div>
      <div v-else class="mr-10">
        <el-empty :image-size="150" description="未上传图片" />
        <span>课程/书籍结构</span>
      </div>
      <div
        v-if="introduce_img"
        style="
          margin: 40px;
          width: 200px;
          height: 200px;
          border: 1px solid rgb(162, 162, 162);
        "
      >
        <img
          class="el-upload-list__item-thumbnail"
          style="width: 100%; height: 100%; object-fit: scale-down"
          :src="introduce_img"
          alt=""
        />
        <span>课程/书籍介绍</span>
        <el-button link type="primary" @click="handlePreview(introduce_img)"
          >查看图片</el-button
        >
      </div>
      <div v-else class="mr-10">
        <el-empty :image-size="150" description="未上传图片" />
        <span>课程/书籍介绍</span>
      </div>

      <div
        v-if="recommend_img"
        style="
          margin: 40px;

          width: 200px;
          height: 200px;
          border: 1px solid rgb(162, 162, 162);
        "
      >
        <img
          class="el-upload-list__item-thumbnail"
          style="width: 100%; height: 100%; object-fit: scale-down"
          :src="recommend_img"
          alt=""
        />
        <span>推荐及提示</span>
        <el-button link type="primary" @click="handlePreview(recommend_img)"
          >查看图片</el-button
        >
      </div>
      <div v-else class="mr-10">
        <el-empty :image-size="150" description="未上传图片" />
        <span>推荐及提示</span>
      </div>

      <div
        v-if="teachers_img"
        style="
          margin: 40px;
          width: 200px;
          height: 200px;
          border: 1px solid rgb(162, 162, 162);
        "
      >
        <img
          style="width: 100%; height: 100%; object-fit: scale-down"
          :src="teachers_img"
          alt=""
        />
        <span>讲师团队</span>
        <el-button link type="primary" @click="handlePreview(teachers_img)"
          >查看图片</el-button
        >
      </div>
      <div v-else class="mr-10">
        <el-empty :image-size="150" description="未上传图片" />
        <span>讲师团队</span>
      </div>

      <el-dialog v-model="dialogStatus.preview">
        <img w-full :src="dialogImageUrl" alt="Preview Image" />
      </el-dialog>
    </el-form-item>

    <el-form-item label="课程章节" prop="totalSection" style="margin-top: 30px">
      <div class="chapterItem" v-for="(item, index) in courseInfo!.sectionList" :key="index">
        <div>第{{ index + 1 }}节 {{ "、" }} {{ (item as any).name }}</div>
        <!-- <div
          :id="`play` + index + (item as any).name"
          style="width: 400px; height: 200px"
        ></div> -->
        <div class="flex">
          <div
            class="mr-20px border-1 border-#2a3347 border-solid relative"
            style="width: 400px; height: 200px"
          >
            <img
              alt="play_button"
              style="object-fit: contain"
              class="absolute w-398px h-198px"
            />
            <el-tooltip content="开始播放" :enterable="false" placement="top">
              <img
                :src="bigPlayButton"
                alt="play_button"
                class="absolute w-64px h-64px left-168px top-68px cursor-pointer"
                @click="handlePlaySection(item.id, item.vid)"
              />
            </el-tooltip>
          </div>
          <div>章节简介：{{ item.description }}</div>
        </div>
      </div>
    </el-form-item>
    <el-form-item
      label="内容"
      style="margin: 40px 0 20px 0"
      v-if="checkTaskBO!.examineStatusCode === 50"
    >
      <div class="slider-demo-block">
        <el-slider
          v-model="checkTaskBO!.additionalDataList[0].score"
          show-input
          style="width: 600px; margin: 0 0 10px 0"
        />
      </div>
    </el-form-item>
    <el-form-item
      label="形式"
      style="margin: 20px 0"
      v-if="checkTaskBO!.examineStatusCode === 50"
    >
      <div class="slider-demo-block">
        <el-slider
          show-input
          v-model="checkTaskBO!.additionalDataList[1].score"
          style="width: 600px; margin: 0 0 10px 0"
        />
      </div>
    </el-form-item>
    <el-form-item label="完成度" v-if="checkTaskBO!.examineStatusCode === 50">
      <div class="slider-demo-block">
        <el-slider
          show-input
          v-model="checkTaskBO!.additionalDataList[2].score"
          style="width: 600px; margin: 0 0 10px 0"
        />
      </div>
    </el-form-item>

    <!-- <el-form-item
        label="是否违规"
        style="margin: 20px 0"
        v-if="Number(String(courseInfo!.examineStatusCode).charAt(0)) === 4"
      >
        <div class="mb-2 flex items-center text-sm">
          <el-radio-group
            class="ml-4"
            v-model="isIllegal"
            @change="handelIllegalChange"
          >
            <el-radio :label="true" size="large">是</el-radio>
            <el-radio :label="false" size="large">否</el-radio>
          </el-radio-group>
        </div>
      </el-form-item> -->

    <!-- <el-form-item
        label="设为核心课程"
        v-if="Number(String(courseInfo!.examineStatusCode).charAt(0)) >= 6"
      >
        <el-select v-model="courseInfo!.core" placeholder="Select" size="large">
          <el-option
            v-for="item in coreArr"
            :key="item.value"
            :label="item.label"
            :value="item.value"
          />
        </el-select>
      </el-form-item> -->

    <el-form-item
      label="审核意见"
      style="margin: 20px 0"
      v-if="checkTaskBO!.status === '0' || checkTaskBO!.examineStatusCode < 50 || checkTaskBO!.examineStatusCode>=60"
    >
      <el-input
        :disabled="!courseInfo!.isOperate"
        v-model="checkTaskBO!.reason"
        maxlength="256"
        placeholder="Please input"
        show-word-limit
        type="textarea"
        style="width: 600px"
        rows="6"
      />
    </el-form-item>
    <div v-if="courseInfo!.isOperate">
      <el-form-item
        label=""
        v-if="String(courseInfo!.examineStatusCode).charAt(0) === '1'"
      >
        <el-button
          type="success"
          @click="teamManagerPass"
          v-hasPermi="['system:examineTask:edit']"
          >通过</el-button
        >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="primary"
          @click="checkTaskSave"
          >保存审核</el-button
        >
        <el-button
          type="danger"
          v-hasPermi="['system:examineTask:edit']"
          @click="teamManagerRefuse"
          >驳回修改</el-button
        >
        <!-- <el-button type="info" @click="cancel">取消</el-button> -->
      </el-form-item>
      <el-form-item
        label=""
        v-else-if="String(courseInfo!.examineStatusCode).charAt(0) === '2'"
      >
        <el-button
          type="success"
          v-hasPermi="['system:examineTask:edit']"
          @click="schoolManagerPass"
          >通过</el-button
        >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="primary"
          @click="checkTaskSave"
          >保存审核</el-button
        >
        <el-button
          type="danger"
          v-hasPermi="['system:examineTask:edit']"
          @click="schoolManagerRefuse"
          >驳回修改</el-button
        >
        <!-- <el-button type="info" @click="cancel">取消</el-button> -->
      </el-form-item>
      <el-form-item
        label=""
        v-else-if="String(courseInfo!.examineStatusCode).charAt(0) === '3'"
      >
        <el-button
          v-if="courseInfo!.onlineStatus === '0'"
          v-hasPermi="['system:examineTask:edit']"
          type="success"
          @click="headmasterPass"
          >发布子站</el-button
        >
        <el-button
          v-if="courseInfo!.onlineStatus === '0'"
          v-hasPermi="['system:examineTask:edit']"
          type="primary"
          @click="publishAndSubmit"
          >发布并提交平台</el-button
        >
        <el-button
          v-else
          v-hasPermi="['system:examineTask:edit']"
          type="primary"
          @click="publishAndSubmit"
          >提交平台</el-button
        >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="primary"
          @click="checkTaskSave"
          >保存审核</el-button
        >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="danger"
          @click="headmasterRefuse"
          >驳回修改</el-button
        >
        <!-- <el-button type="info" @click="cancel">取消</el-button> -->
      </el-form-item>
      <!-- <el-form-item
        label=""
        v-else-if="String(courseInfo!.examineStatusCode).charAt(0) === '4'"
      >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="success"
          @click="politicsExpertPass"
          >通过</el-button
        >
        <el-button type="danger" @click="politicsExpertRefuse"
          >驳回修改</el-button
        >
        <el-button type="info">取消</el-button>
      </el-form-item> -->
      <el-form-item
        label=""
        v-else-if="String(courseInfo!.examineStatusCode).charAt(0) === '5'"
      >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="success"
          @click="contentExpertPass"
          >通过</el-button
        >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="primary"
          @click="checkTaskSave"
          >保存审核</el-button
        >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="danger"
          @click="contentExpertRefuse"
          >驳回修改</el-button
        >
        <!-- <el-button type="info" @click="cancel">取消</el-button> -->
      </el-form-item>
      <el-form-item
        label=""
        v-else-if="String(courseInfo!.examineStatusCode).charAt(0) === '6'"
      >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="success"
          @click="operationPeoplePass"
          >运营通过</el-button
        >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="primary"
          @click="contentExpertPass"
          >保存审核</el-button
        >
        <el-button
          v-hasPermi="['system:examineTask:edit']"
          type="danger"
          @click="operationPeopleRefuse"
          >驳回修改</el-button
        >
      </el-form-item>
    </div>
    <div
      v-if="
        !courseInfo!.isOperate &&
        checkTaskBO!.examineStatusCode >= 50 &&
        checkTaskBO!.examineStatusCode < 60
      "
    >
      <el-form-item label="我的审核结果">
        <el-card class="box-card mr-5">
          <div>
            <div>{{ auditStage(checkTaskBO!.examineStatusCode) }}</div>
            <div>审核时间：{{ checkTaskBO!.createTime }}</div>
            <div>
              内容：{{ checkTaskBO!.additionalDataList[0].score }} 形式：{{
                checkTaskBO!.additionalDataList[1].score
              }}
              完成度：{{ checkTaskBO!.additionalDataList[2].score }}
            </div>
            <div>审核结果：{{ checkTaskBO!.reason }}</div>
          </div>
        </el-card>
      </el-form-item>

      <el-form-item
        label="其他审核结果"
        v-if="checkTaskBO!.examineStatusCode % 10 === 1"
      >
        <el-card
          class="box-card mr-5 scrollbar-demo-item"
          v-for="(item, index) in otherExportCheckList"
          :key="index"
        >
          <div>
            <div>{{ auditStage(item.examineStatusCode) }}</div>
            <div>审核时间：{{ item.createTime }}</div>
            <div>审核结果：{{ item.reason }}</div>
          </div>
        </el-card>
      </el-form-item>
    </div>
  </el-form>

  <!-- 播放器 -->
  <el-dialog
    v-model="dialogStatus.player"
    title="播放章节"
    width="420px"
    @close="handleClosePlayerDialog"
  >
    <div :id="'player-' + dialogStatus.sectionId" class="w-400px h-200px"></div>
  </el-dialog>
</template>

<script lang="ts" setup>
import {
  getAgeList as getAgeListApi,
  getSceneList as getSceneListApi,
  getPlayAuth as getPlayAuthApi,
  getFirstCatgroyList as getFirstCatgroyListApi,
  teamManagerPass as teamManagerPassApi,
  teamManagerRefuse as teamManagerRefuseApi,
  schoolManagerPass as schoolManagerPassApi,
  schoolManagerRefuse as schoolManagerRefuseApi,
  headmasterPass as headmasterPassApi,
  publishAndSubmit as publishAndSubmitApi,
  headmasterRefuse as headmasterRefuseApi,
  politicsExpertPass as politicsExpertPassApi,
  contentExpertPass as contentExpertPassApi,
  politicsExpertRefuse as politicsExpertRefuseApi,
  operationPeoplePass as operationPeoplePassApi,
  contentExpertRefuse as contentExpertRefuseApi,
  operationPeopleRefuse as operationPeopleRefuseApi,
  setCore as setCoreApi,
  getCourseInfo as getCourseInfoApi,
  checkTaskSave as checkTaskSaveApi,
} from "@/service/api/course/check";
import { ElButton } from "element-plus";
import {
  CourseExamineStageMap,
  CourseExamineStatusMap,
} from "@/maps/course/examine/courseExamineStatusMap.ts";
import to from "await-to-js";
import bigPlayButton from "@/assets/images/bigplay.png";


// 获取年龄列表BO
const initGetAgeListBo = {
  type: "1",
};

const initDialogStatus = {
  preview: false,
  player: false,
  sectionId: "",
};

const props = defineProps({
  //子组件接收父组件传递过来的值
  courseInfo: Object,
  checkTaskBO: Object,
  schoolCheckList: Array,
  rejectCheckList: Array,
  otherExportCheckList: Array,
});

// 获取章节列表BO
const initGetChapterListBo = {
  courseId: "",
};
//  是否违规
const isIllegal = ref(false);

// 审核任务详情BO
// const initCheckTaskBO = {
//   sourceId: "",
//   behavior: "",
//   // 是否进入下一审批
//   resume: "",
//   additionalDataList: [
//     {
//       dataType: "courseScore",
//       score: 0,
//       type: "0",
//     },
//     {
//       dataType: "courseScore",
//       score: 0,
//       type: "1",
//     },
//     {
//       dataType: "courseScore",
//       score: 0,
//       type: "2",
//     },
//   ],
// };

// 数据
const data = reactive({
  getAgeListBo: { ...initGetAgeListBo },
  getChapterListBo: { ...initGetChapterListBo },
  dialogStatus: { ...initDialogStatus },
});

const { getAgeListBo, dialogStatus } = toRefs(data);
const { courseInfo, checkTaskBO } = toRefs(props);
const isDisabled = ref(true);
// 选择框数据
const selectArr = reactive({
  // 类型
  typeArr: [
    {
      value: "1",
      label: "读书",
    },
    {
      value: "2",
      label: "课程",
    },
  ],
  // 孩子年龄列表
  childAgeArr: [],
  // 父母年龄列表
  parentAgeArr: [],
  // 场景列表
  sceneArr: [],
  // 二级分类列表
  catgroyList: [],
  // 标签列表
  labelList: [],
  // 资源类型
});

// 获取孩子年龄列表、家长年龄列表、所有场景
const getDefaultList = async () => {
  getAgeListBo.value.type = "1";
  const res = await getAgeListApi(getAgeListBo.value);
  selectArr.childAgeArr = res.rows;
  getAgeListBo.value.type = "2";
  const res2 = await getAgeListApi(getAgeListBo.value);
  selectArr.parentAgeArr = res2.rows;
  const res3 = await getSceneListApi();
  selectArr.sceneArr = res3.rows;
};

// 图片
const introduce_img = ref();
const structure_img = ref();
const teachers_img = ref();
const recommend_img = ref();
// 获取课程介绍图片
const getCourseImg = (courseInfo: any) => {
  console.log(courseInfo);

  if (courseInfo) {
    if (courseInfo.courseImgList && courseInfo.courseImgList.length > 0) {
      if (
        courseInfo.courseImgList.filter((item: any) => item.type == 2).length >
        0
      ) {
        introduce_img.value = courseInfo.courseImgList.filter(
          (item: any) => item.type == 2,
        )[0].url;
      }
      if (
        courseInfo.courseImgList.filter((item: any) => item.type == 1).length >
        0
      ) {
        structure_img.value = courseInfo.courseImgList.filter(
          (item: any) => item.type == 1,
        )[0].url;
      }
      if (
        courseInfo.courseImgList.filter((item: any) => item.type == 3).length >
        0
      ) {
        recommend_img.value = courseInfo.courseImgList.filter(
          (item: any) => item.type == 3,
        )[0].url;
      }
      if (
        courseInfo.courseImgList.filter((item: any) => item.type == 4).length >
        0
      ) {
        teachers_img.value = courseInfo.courseImgList.filter(
          (item: any) => item.type == 4,
        )[0].url;
      }
    } else {
      introduce_img.value = "";
      structure_img.value = "";
      teachers_img.value = "";
      recommend_img.value = "";
    }
  }
};
const dialogImageUrl = ref();
// 查看图片的
const handlePreview = (url: any) => {
  dialogImageUrl.value = url;
  dialogStatus.value.preview = true;
};

// 获取一级分类
const getFirstCatgroyList = async (id: string) => {
  const res = await getFirstCatgroyListApi(id);
  console.log(res);
  selectArr.catgroyList = res.data;
};

// 获取章节列表
const getChapterList = async (sectionList: any) => {
  if (sectionList) {
    // 循环生成视频播放器
    for (let i = 0; i < sectionList.length; i++) {
      let vid: string = sectionList[i].vid;
      const res = await getPlayAuthApi(vid);
      let playAuth = res.data.playAuth;
      console.log(sectionList[i].name, sectionList.length);
      nextTick(() => {
        new Aliplayer({
          id: "play" + i + sectionList[i].name,
          width: "100%",
          vid: vid, //必选参数。音视频ID。示例：1e067a2831b641db90d570b6480f****。
          playauth: playAuth, //必选参数。音视频播放凭证。
          autoplay: false,
          preload: false,
        });
      });
    }
  }
};

// 保存审核
const checkTaskSave = async () => {
  const [err, res] = await to(checkTaskSaveApi(checkTaskBO!.value));
  if (!err) {
    console.log(res);
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  } else {
    ElMessage({
      type: "error",
      message: "操作失败",
    });
  }
};

// 驳回阶段
const auditStage = (code: number) => {
  console.log(code);

  const stage = code.toString().charAt(0);
  const status = code.toString().charAt(1);
  const stageStr = CourseExamineStageMap.get(stage);
  const statusStr = CourseExamineStatusMap.get(status);

  return `${stageStr}${statusStr}`;
};

const emits = defineEmits(["closeDialog"]);

// 选择是否违规
// const handelIllegalChange = (val: any) => {
//   if (val) {
//     checkTaskBO!.value!.reason = "违规原因：";
//   }
// };
// 团队管理员通过审核按钮
const teamManagerPass = async () => {
  console.log(checkTaskBO?.value);
  // 提交审核
  checkTaskBO!.value!.behavior = 1;
  const res = await teamManagerPassApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog");
};

// 团队管理员拒绝按钮
const teamManagerRefuse = async () => {
  checkTaskBO!.value!.behavior = 2;
  const res = await teamManagerRefuseApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog");
};

// 团队管理员取消
const cancel = () => {
  emits("closeDialog");
};

// 学校管理员审核通过按钮
const schoolManagerPass = async () => {
  console.log(checkTaskBO?.value);
  // 提交审核
  checkTaskBO!.value!.behavior = 1;
  const res = await schoolManagerPassApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog");
};

// 学校管理员拒绝按钮
const schoolManagerRefuse = async () => {
  checkTaskBO!.value!.behavior = 2;
  const res = await schoolManagerRefuseApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog");
};

// 校长发布子站
const headmasterPass = async () => {
  console.log(checkTaskBO?.value);
  // 提交审核
  checkTaskBO!.value!.behavior = 1;
  checkTaskBO!.value!.resume = false;
  const res = await headmasterPassApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog");
};

// 校长发布子站并提交
const publishAndSubmit = async () => {
  console.log(checkTaskBO?.value);
  // 提交审核
  checkTaskBO!.value!.behavior = 1;
  checkTaskBO!.value!.resume = true;
  const res = await publishAndSubmitApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog");
};

// 校长拒绝
const headmasterRefuse = async () => {
  checkTaskBO!.value!.behavior = 2;
  checkTaskBO!.value!.resume = false;
  const res = await headmasterRefuseApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog");
};

// // 政治审核专家通过
// const politicsExpertPass = async () => {
//   // 提交审核
//   checkTaskBO!.value!.behavior = 1;
//   checkTaskBO!.value!.resume = false;
//   console.log(checkTaskBO?.value);
//   const res = await politicsExpertPassApi(checkTaskBO?.value);
//   console.log(res);
//   if (res.code === 200) {
//     ElMessage({
//       type: "success",
//       message: "操作成功",
//     });
//   }
//   emits("closeDialog");
// };

// // 政治审核专家拒绝
// const politicsExpertRefuse = async () => {
//   checkTaskBO!.value!.behavior = 2;
//   checkTaskBO!.value!.resume = false;
//   const res = await politicsExpertRefuseApi(checkTaskBO?.value);
//   console.log(res);
//   if (res.code === 200) {
//     ElMessage({
//       type: "success",
//       message: "操作成功",
//     });
//   }
//   emits("closeDialog");
// };

// 内容专家通过
const contentExpertPass = async () => {
  // 提交审核
  console.log(checkTaskBO?.value.additionalDataList);
  if (
    checkTaskBO?.value.examineStatusCode >= 50 &&
    checkTaskBO?.value.examineStatusCode < 60
  ) {
    if (
      checkTaskBO?.value.additionalDataList.find((item) => item.score === 0)
    ) {
      ElMessage({
        type: "error",
        message: "请先对课程进行评分",
      });
    } else {
      checkTaskBO!.value!.behavior = 1;
      checkTaskBO!.value!.resume = false;
      console.log(checkTaskBO?.value);
      const res = await contentExpertPassApi(checkTaskBO?.value);
      console.log(res);
      if (res.code === 200) {
        ElMessage({
          type: "success",
          message: "操作成功",
        });
      }
      emits("closeDialog");
    }
  } else {
    checkTaskBO!.value!.behavior = 1;
    checkTaskBO!.value!.resume = false;
    console.log(checkTaskBO?.value);
    const res = await contentExpertPassApi(checkTaskBO?.value);
    console.log(res);
    if (res.code === 200) {
      ElMessage({
        type: "success",
        message: "操作成功",
      });
    }
    emits("closeDialog");
  }
};

// 内容专家审核拒绝
const contentExpertRefuse = async () => {
  // 提交审核
  checkTaskBO!.value!.behavior = 2;
  checkTaskBO!.value!.resume = false;
  console.log(checkTaskBO?.value);
  const res = await contentExpertRefuseApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog", "测试");
};

// 运营通过
const operationPeoplePass = async () => {
  // 提交审核
  checkTaskBO!.value!.behavior = 1;
  checkTaskBO!.value!.resume = false;
  console.log(checkTaskBO?.value, courseInfo?.value);
  // const res = await setCoreApi(courseInfo?.value);
  // if (res.code === 200) {
  const res = await operationPeoplePassApi(checkTaskBO?.value);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
    emits("closeDialog");
  }
  // }
};

// 运营拒绝
const operationPeopleRefuse = async () => {
  // 提交审核
  checkTaskBO!.value!.behavior = 2;
  checkTaskBO!.value!.resume = false;
  console.log(checkTaskBO?.value);
  const res = await operationPeopleRefuseApi(checkTaskBO?.value);
  console.log(res);
  if (res.code === 200) {
    ElMessage({
      type: "success",
      message: "操作成功",
    });
  }
  emits("closeDialog");
};

const dialogPlayer = ref();
/**
 * 播放章节视频
 * @param sectionId
 * @param vid
 */
const handlePlaySection = async (sectionId: string, vid?: string) => {
  if (vid) {
    dialogStatus.value.sectionId = sectionId;
    const [err, res] = await to<BaseResponse<VodPlayAuth>, any>(
      getPlayAuthApi(vid ?? ""),
    );
    //   if (!err) {
    //     if (res?.data != null) {
    //       const playAuth = res.data.playAuth;
    //       if (playerList.value[i]) {
    //         // 如果已有播放器则清除播放器
    //         playerList.value[i].dispose();
    //       }
    //       playerList.value[i] = new Aliplayer({
    //         id: "player-" + section.id,
    //         width: "100%",
    //         vid: vid, //必选参数。音视频ID。示例：1e067a2831b641db90d570b6480f****。
    //         playauth: playAuth, //必选参数。音视频播放凭证。
    //         autoplay: false,
    //         preload: false,
    //         useH5Prism: true,
    //       });
    //     }
    //   }
    if (!err) {
      const playAuth: string = res?.data?.playAuth ?? "";
      dialogStatus.value.player = true;
      await nextTick(() => {
        // if (dialogPlayer.value) {
        //   // 销毁之前已有的视频
        //   dialogPlayer.value.dispose();
        // }
        dialogPlayer.value = new Aliplayer({
          id: "player-" + sectionId,
          width: "100%",
          vid: vid, //必选参数。音视频ID。示例：1e067a2831b641db90d570b6480f****。
          playauth: playAuth, //必选参数。音视频播放凭证。
          autoplay: true,
          preload: true,
        });
      });
    } else {
      ElMessage({
        type: "info",
        message: "未绑定视频",
      });
    }
  }
};

const handleClosePlayerDialog = () => {
  if (dialogPlayer.value) {
    dialogPlayer.value.dispose();
  }
};

onMounted(() => {
  getDefaultList();
});

// 这里能拿到父组件传过来的值
const categoryId = ref();
onUpdated(() => {
  getChapterList(courseInfo?.value!.sectionList);
  console.log(courseInfo?.value!, checkTaskBO?.value);
  getFirstCatgroyList(courseInfo?.value!.sceneId);
  getCourseImg(props.courseInfo);
});
</script>

<style scoped>
.slider-demo-block {
  display: flex;
  align-items: center;
}
.slider-demo-block .el-slider {
  margin-top: 0;
  margin-left: 12px;
}

.scrollbar-flex-content {
  display: flex;
  /* width: 60%; */
}
.scrollbar-demo-item {
  flex-shrink: 0;
  /* display: flex; */
  /* align-items: center; */
  /* justify-content: center; */
  /* text-align: center; */
  border-radius: 4px;
  /* height: 30vh; */
}
</style>
